<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图书借阅系统前台</title>
    <link rel="icon" href="../static/favicon.ico" th:href="@{/favicon.ico}" type="image/x-icon">
    <!--导入网页图标 -->
    <link rel="shortcut icon" href="../static/favicon.ico" th:href="@{/favicon.ico}" type="image/x-icon">
    <!--导入网页图标 -->
    <script src="../static/lib/jQuery/jquery-3.5.1.min.js" th:src="@{/lib/jQuery/jquery-3.5.1.min.js}"></script>
    <!--导入jQuery库 -->
    <script src="../static/lib/layui/layui.js" th:src="@{/lib/layui/layui.js}"></script>
    <!--导入layUI库 -->
    <script src="../static/lib/cookie/js.cookie-2.2.1.min.js" th:src="@{/lib/cookie/js.cookie-2.2.1.min.js}"></script>
    <!--导入cookie库 -->
    <link rel="stylesheet" href="../static/lib/layui/css/layui.css" th:href="@{/lib/layui/css/layui.css}" media="all">
    <!--导入layUI css库 -->
    <link rel="stylesheet" href="../static/css/common.css" th:href="@{/css/common.css}">
    <!--导入公共的css，其中可定义整个网页的配色方案 -->
    <link rel="stylesheet" href="../static/css/index.css" th:href="@{/css/index.css}">
</head>

<body>
    <div>
        <ul class="layui-nav" lay-filter="" style="position: fixed;top:0;left: 0;right: 0;z-index: 1000;">
            <li class="layui-nav-item"><a href="" id="hover_div" style="font-size:large">&nbsp;图书借阅系统</a></li>

            <li class="layui-nav-item layui-layout-right" style="margin-right: 100px;">
                <a href="javascript:;">
                    <img src="../static/images/default.jpg"
                        th:src="${session.user==null?'/images/default.jpg':session.user.picture}" class="layui-nav-img">
                    <span th:text="${session.user==null?'未登录':session.user.username}">啊、是你</span>
                </a>
                <dl class="layui-nav-child">
                    <dd><a href="" th:href="@{/borrow}">借书管理</a></dd>
                    <dd><a href="" th:href="@{/userInfo}">个人中心</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item layui-layout-right"><a href="/loginOut">安全退出</a></li>
        </ul>
    </div>

    <div style="margin-top:60px;margin-left:200px;margin-right:200px;margin-bottom:60px;height:1500px;">
        <input type="hidden" id="u_id" th:value="${session.user==null?-1:session.user.userId}">

        <div class="layui-form layui-form-pane" style="margin-top: 10px;" action="" th:object="${book}">

            <div class="layui-form-item">
                <div class="layui-input-block">
                    <input name="bookId" th:value="*{bookId}" type="hidden" autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">图书名称</label>
                <div class="layui-input-block">
                    <input type="text" name="bookName" th:value="*{bookName}" lay-verify="required"
                        lay-reqtext="图书类别名称不可以为空" placeholder="" autocomplete="off" class="layui-input" readonly>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">图书类别</label>
                <div class="layui-input-block">
                    <input type="text" name="bookName" th:value="*{type.typename}" lay-verify="required"
                        lay-reqtext="图书类别名称不可以为空" placeholder="" autocomplete="off" class="layui-input" readonly>
                </div>
                
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">图书作者</label>
                <div class="layui-input-block">
                    <input type="text" name="bookWriter" th:value="*{bookWriter}" lay-verify="required"
                        lay-reqtext="图书类别名称不可以为空" placeholder="" autocomplete="off" class="layui-input" readonly>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">馆藏总数</label>
                    <div class="layui-input-inline">
                        <input type="text" name="bookSumNumber" th:value="*{bookSumNumber}" lay-verify="required|number"
                            autocomplete="off" class="layui-input" readonly>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">当前库存</label>
                    <div class="layui-input-inline">
                        <input type="text" name="bookNumber" th:value="*{bookNumber}" lay-verify="required|number"
                            autocomplete="off" class="layui-input" readonly>
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">单价</label>
                    <div class="layui-input-inline">
                        <input type="text" name="bookPrice" th:value="*{bookPrice}" lay-verify="required|number"
                            autocomplete="off" class="layui-input" readonly>
                    </div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">内容简介</label>
                <div class="layui-input-block">
                    <!--                        <input type="hidden" name="bookDescription" th:value="*{bookDescription}" >-->
                    <textarea placeholder="" name="bookDescription" th:text="*{bookDescription}"
                        class="layui-textarea" readonly></textarea>
                </div>
            </div>

            <div class="layui-upload-list">
                <img class="layui-upload-img book_picture" id="pic" th:src="${book.picture!=null?book.picture:'/images/default.png'}">
                <p id="demoText"></p>

            </div>

            <div class="layui-upload">
                <a class="layui-btn layui-btn-normal" style="width: 120px;" th:href="@{/index/}">返回主页</a>
                <a class="layui-btn" id="do_btn" style="width: 120px;" >我要借书</a>

            </div>
        </div>

    </div>

    <div th:fragment="admin-footer" class="lms-footer">

        ©2020 版权归武汉理工大学计算机1702"我都行，你们商量吧"小组所有&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <span style="color:rgb(144, 145, 146)">
            技术支持：https://www.layui.com/
        </span>
    </div>

    <script>
        //$('#hover_div').unbind(mouseenter).unbind(mouseleave);
        //JavaScript代码区域
        layui.use(['element', 'form', 'upload','layer'], function () {
            var element = layui.element;
            var layer = layui.layer;

            //业务代码
            $("#do_btn").click(function () {
                if(parseInt($("[name='bookNumber']").val())<=0){
                    layer.msg("这本书已经全部被借走了，下次早点来哦")
                }else{
                   var bookId = parseInt( $("[name='bookId']").val());

                   window.location.href = "/request/rentRequest?bookId="+bookId;

                }

            });

            //toDo
        });
    </script>

</body>

</html>